<template>
	<view class="p-bot140" :style="{'--color':color}">
		<status-bar title='收货地址'></status-bar>
		<view class="row a-center bgwhite padding20 bor_radius_10" @click="chooseAddress">
			<view class="iconfont icon-weixin color_wechat size42"></view>
			<text class="black size26 m-left20">获取微信收货地址</text>
			<view class="iconfont icon-a-zujian7 h6 color_99 j-self-end"></view>
		</view>
		
		<view class="row a-center bgwhite m-top20 list bor_radius_10" 
		      v-for="(item,index) in pageData" :key="index">
			<view class="flex-1 d-flex f-column" @click="saveDefaultAddress(item.id)">
				<text class="black size28 bold500">{{item.Aregion}}{{item.Aaddress}}</text>
				<view class="d-flex a-center m-top20">
					<view class="acquiesce white h7 padding2-10 bor_radius_10 m-right20" v-if="item.is_default == 1">默认</view>
					<text class="color_99 h6 m-right16">{{item.Aname}}</text>
					<text class="color_99 h6 ">{{item.Amobile}}</text>
				</view>
			</view>
			<view class="iconfont icon-bianji color_cc size30 edit" 
			     @click.stop="toUrl(`editAddress?id=${item.id}&bid=${item.bid}&type=2`)"></view>
		</view>
		
		<emptys empty="address" v-if="!pageData.length"></emptys>	
		
		<view class="Addressbot  white size28 flexac" 
		      @click="toUrl(`editAddress?type=1`)">+新增地址</view>
	</view>
</template>

<script>
	import {mapState} from 'vuex';
	export default {
		data() {
			return {
				pageData:[],
			}
		},
		onShow() {
			this.getAddress();
		},
		methods: {
			async chooseAddress(){
				const addressResult = await this.$pop.chooseAddress();
				this.addAdress(addressResult);
				console.log(addressResult,'addressResult');
			},
			getAddress(){ // 获取收货地址
				this.$http.post({
					url: '/zzj_singleSaleApi/getAddress',
				}).then(res => {
					if(!res.data) return;
					this.pageData = res.data;
				})
			},
			
			addAdress(item){
				this.$http.post({
					url: '/zzj_singleSaleApi/addAdress',
					data:{
						Aname:item.userName,
						Amobile:item.telNumber,
						Aregion:`${item.provinceName}${item.cityName}${item.countyName}`,
						Aaddress:item.detailInfo,
						is_default:0
					}
				}).then(res => {
					if(res.code != 100) return this.$Toast(res.msg);
					this.getAddress();
				})
			},
			
			saveDefaultAddress(id){
				this.$http.get({
					url:'/zzj_singleSaleApi/saveDefaultAddress',
					data:{
						id
					}
				}).then(res=>{
					if(res.code != 100) return this.$Toast(res.msg,2);
					this.$back();
				})
			}
		},
		computed:{
			...mapState(['color']),
		}
	}
</script>

<style>
	page{
		background-color: #f7f9fa;
		padding:20rpx 30rpx;
		box-sizing: border-box;
	}
</style>
<style lang="scss" scoped>
	.list{
		padding:26rpx 0 26rpx 20rpx;
	}
	.edit{
		padding:20rpx 20rpx 20rpx 40rpx
	}
	.Addressbot{
		width:690rpx;
		height: 80rpx;
		position: fixed;
		bottom: 100rpx;
		left:30rpx;
		border-radius: 40rpx;
		z-index:100;
		background-color: var(--color);
	}
	.acquiesce{
		background-color: var(--color);
	}
</style>
